<template>
  <div class="a">
    <div class="boxone">
   <el-page-header :icon="ArrowLeft" title="编辑通知 " @click=accc()>
  <template #extra>
    <div class="flex items-center">
      <el-button @click="accc()">取消</el-button>
      <el-button type="primary" @click="fun()">发送</el-button>
      

    </div>
  </template>
</el-page-header>

</div>
    <div class="box">
      <p>标题标题</p>
      <input type="text" v-model="txt1" placeholder="输入用户标题">
    </div>
    <div class="box">
      <p>通知用户id</p>
      <input type="text" v-model="txt2" placeholder="输入用户id：104">
    </div>
    <div class="box"> 
      <p>通知详情</p>
      <input type="text" v-model="txt3" placeholder="输入用户详情">
    </div>
<div class="b">
  <p>权限</p>
  <el-radio-group v-model="radio1" class="ml-4">
      <el-radio label="1" size="large" @click="aone()">1</el-radio>
      <el-radio label="2" size="large" @click="atwo()">2</el-radio>
    </el-radio-group>
</div>
<div class="btn">
   <el-button type="primary" @click="fabu()">发布</el-button>
</div>
  </div>
</template>

<script setup>
import  { useRouter } from "vue-router";
import { ref } from 'vue'
import server from "@/api/index.ts";
const radio1 = ref('1')
const txt1=ref("")
const txt2=ref("")
const txt3=ref("")
//获取路由管理实例
var router = useRouter();



var fabu=async()=>{
  console.log(txt1.value,txt2.value,txt3.value,radio1.value);
  var res=await  server.juxiaohutong.addlink({title:txt1.value,typeId:txt2.value,detail:txt3.value,priority:radio1.value,})
 if (res.data.code == 200) {
     ElNotification.success({ message: '添加成功' })
 
   router.push("/index/juxiaotongzhi/juxiao");
    
  }
}
var accc=()=>{
   router.push("/index/juxiaotongzhi/juxiao"); 
}

var aone=()=>{
  // radio1.value=1
   console.log(  radio1.value);
  // console.log(1);

}
var atwo=()=>{
//  radio1.value=2
   console.log(  radio1.value);

}
</script>

<style scoped>
.box{
    display: flex;
  
}

.a{
 padding-top: 30px;
 padding-left: 30px;
  width: 97%;
  height: 500px;
    background-color: #fff;
}
input{

  margin: 10px 10px;
}
p{
width: 80px;
  margin: 10px 10px;
}
.b{
  padding-left: 30px;
  display: flex;
}
.btn{
  margin-left: 100px;
  margin-top: 30px;
}
:deep(.el-main ){
  margin: 0;
  padding: 0;
}
</style>